<template>
  <el-popover placement="bottom" width="400px" v-model="show">
    <el-button
      slot="reference"
      circle
      plain
      type="primary"
      icon="el-icon-search"
      style="margin-left:12px"
    ></el-button>
    <el-container>
      <el-header>
        <h2>检索条件</h2>
      </el-header>
      <el-main style="maxHeight:calc(100vh - 300px)">
        <el-alert
          title="以下选项留空即不对该项进行筛选"
          type="info"
          show-icon
          close-text="知道了"
          style="margin-bottom:14px"
        ></el-alert>
        <filter-view :source-type="sourceType" @close="show=false" @submit="doQuery" />
      </el-main>
    </el-container>
  </el-popover>
</template>

<script>
import FilterView from "@/components/FilterView";

export default {
  props: {
    sourceType: {
      type: String,
      required: true,
    },
  },
  components: {
    FilterView,
  },
  data() {
    return {
      show: false,
    };
  },
  computed: {
    action() {
      if (this.sourceType === "rectify") {
        return "query/queryRectify";
      }
      if (this.sourceType === "inspect") {
        return "query/queryInspect";
      }
      return "";
    },
  },
  methods: {
    doQuery({ filter, action = this.action }) {
      this.$store
        .dispatch(action, { filter })
        .then((content) => {
          if (content.length > 0) {
            this.$notify.success({
              title: "检索完成",
              message: "共找到" + content.length + "条记录",
            });
          } else {
            this.$notify.warning({
              title: "检索完成",
              message: "没有找到符合要求的记录",
            });
          }
        })
        .catch((error) => {
          this.$notify.error({ title: "", message: JSON.stringify(error) });
        });
      this.show = false;
    },
  },
};
</script>